<template>
  <div class="merchantsFunction">
    <div class="main">
      <div class="listBox">
        <div class="status" v-if="data.integralMarketing == ''">未开通</div>
        <div class="status" v-if="data.integralMarketing">已开通</div>
        <div class="list">
          <img src="@/static/Group 21499.png" alt="">
          <span>积分营销</span>
        </div>
        <el-button type="primary" @click="handleintegral()" v-if="data.integralMarketing == ''">开通</el-button>
        <el-button type="primary" @click="editintegral()" v-else>编辑</el-button>
      </div>
      <div class="listBox">
        <div class="status" v-if="data.shenye == ''">未开通</div>
        <dict-tag class="status" v-else :options="shenyeList" :value="data.shenye" />
        <div class="list">
          <img src="@/static/Group 21499.png" alt="">
          <span>神椰板块</span>
        </div>
        <el-button type="primary" @click="handleOpen('shenye')"
          v-if="(data.shenye == '' || data.shenye == 3) && cancelAudit != 1">开通</el-button>
        <el-button type="primary" @click="lookCode('shenye')" v-if="data.shenye == 2">查看二维码</el-button>
        <!-- <el-button type="primary" @click="handleOpen('nfr')" style="margin: 10px 0 0;">开通
        </el-button> -->
        <el-button type="primary" @click="handleOpenEdit('nfr')" size="small" v-if="data.shenye == 2" style="margin: 10px 0 0;">修改结算方式</el-button>
      </div>
      <div class="suanBox_1">
        <div class="suanBox">
          <div class="listBox">
            <div class="status" v-if="data.fund == ''">未开通</div>
            <dict-tag v-else-if="data.fund == 2" :options="everydayStatusList" :value="data.everydayStatus"
              class="status" />
            <dict-tag v-else-if="data.fund == 1  || data.fund == 3" :options="shenyeList" :value="data.fund"
              class="status" />
            <div class="status" v-else></div>
            <div class="list">
              <img src="@/static/Group 21493.png" alt="">
              <span>日常收款</span>
            </div>
            <!-- <el-button type="primary" @click="handleOpen('zijin')" v-if="(data.fund == '' || data.fund == 3) && cancelAudit != 1">开通</el-button> -->
            <el-button type="primary" @click="lookCode('zijin')" v-if="data.fund == 2 && data.payQrCode">查看收款码
            </el-button>
          </div>
          <div class="listBox">
            <div class="status" v-if="data.fund == ''">未开通</div>
            <dict-tag v-else-if="data.fund == 2" :options="depositStatusList" :value="data.depositStatus"
              class="status" />
            <dict-tag v-else-if="data.fund == 1  || data.fund == 3" :options="shenyeList" :value="data.fund"
              class="status" />
            <div class="status" v-else></div>
            <div class="list">
              <img src="@/static/Group 21494.png" alt="">
              <span>存管账户</span>
            </div>
            <el-button type="primary" @click="lookCode('kyydianpu')" v-if="data.fund == 2 && data.kyyStoreQrCode">查看店铺码
            </el-button>
          </div>
        </div>
        <el-button type="primary" @click="handleOpen('zijin')"
          v-if="(data.fund == '' || data.fund == 3) && cancelAudit != 1">开通</el-button>
        <!-- <el-button type="primary" @click="lookCode('zijin')" v-if="data.fund == 2 && data.payQrCode">查看收款码</el-button> -->
      </div>
      <!-- <div class="listBox">
        <div class="status" v-if="data.nfrIssuerName == ''">未开通</div>
        <div class="status" style="color: #606266" v-else>已开通</div>
        <div class="list">
          <img src="@/static/nfr_icon.png" alt="">
          <span>发行NFR</span>
        </div>
        <el-button type="primary" @click="handleOpen('nfr')" v-if="data.nfrIssuerName == '' && cancelAudit != 1">开通
        </el-button>
        <div v-else-if="data.nfrIssuerName != ''" class="listBottom">
          <div class="issuer">发行方：{{data.nfrIssuerName}}</div>
          <el-button type="primary" @click="handleOpenEdit('nfr')" size="small" v-if="cancelAudit != 1">修改</el-button>
        </div>
      </div> -->
      <div class="listBox">
        <div class="status">{{data.film == ''?'未开通':'已开通'}}</div>
        <div class="list">
          <img src="@/static/film_icon.png" alt="">
          <span>观影活动</span>
        </div>
        <el-button type="primary" @click="filmOpen" v-if="data.film==''">开通</el-button>
      </div>
    </div>
    <detail-dialog v-if="detailDialog" :id="id" :pathType='pathType' :visible.sync="detailDialog"
      @success="_handleSuccess" :isAdd="isAdd" :dataItem="data" />

    <code-dialog v-if="codeDialog" :id="id" :pathType='pathType' :data='data' :visible.sync="codeDialog"
      @success="_handleSuccess" />  

    <Integral-diadog v-if="integralDialog" :id="id" :visible.sync="integralDialog" :phone="phone" :merchantName="merchantName" :merchantId="merchantId" :isintegralAdd="isintegralAdd"
      @success="_handleSuccess" />
  </div>
</template>
<script>
  // components
  import Loading from "@/components/Loading/index";
  import DetailDialog from "./merchantsFunction/DetailDialog";
  import CodeDialog from "./merchantsFunction/codeDialog";  
  import IntegralDiadog from "./merchantsFunction/integralDiadog"; 

  // api
  import {
    merchantModule,
    moduleFilmOpen,
    moduleOpen
  } from "@/api/merchants/merchantsFunction";
  import {
    getMerchantBaseInfoDetail,
  } from "@/api/merchants";
  import {
    reject
  } from "@/api/regitserVerify";
  export default {
    components: {
      Loading,
      DetailDialog,
      CodeDialog,
      IntegralDiadog
    },
    props: {
      id: String,
    },
    inject: ["cancelAudit"],
    data() {
      return {
        detailDialog: false,
        codeDialog: false,
        integralDialog: false,
        data: {},
        depositStatusList: [], //监管账户状态
        everydayStatusList: [], //日常收款状态
        shenyeList: [], //神椰乐园 
        pathType: 'sheye',
        isAdd: true, //是否是发行NFR
        isintegralAdd: true,
        shopName: "",
        phone: '',
        merchantName: '',
        merchantId: '',
      };
    },
    computed: {},
    created() {
      this.getDict()
      this.getDetail();
      this.getuser()
    },
    methods: {

      //获取字典
      getDict() {
        var dictType = "merchant_fund_entry_status,merchant_fund_entry_status,merchant_register_apply_status";
        this.$getSelectList(dictType)
          .then((res) => {
            this.depositStatusList = res.result[0].dictList;
            this.everydayStatusList = res.result[1].dictList;
            this.shenyeList = res.result[2].dictList;
          })
          .finally(() => {
            this.loading = false;
          });
      },
      getuser() {
        getMerchantBaseInfoDetail(this.id).then((res) => {
          const {
            result
          } = res;

          this.phone = result.phone;
          this.merchantName = result.merchantName
         
        });
      },
      //获取基本信息
      getDetail() {
        merchantModule(this.id).then((res) => {
          const {
            result
          } = res;
          this.data = result;
      
        });
      },
      //  开通神椰
      handleOpen(id) {
        this.detailDialog = true
        this.pathType = id
      },
      // 修改 发行NFR
      handleOpenEdit(id) {
        this.detailDialog = true
        this.pathType = id
        this.isAdd = false
      },
      lookCode(id) {
        this.codeDialog = true
        this.pathType = id
      },
      //开通积分营销
      handleintegral(){
        this.integralDialog = true
        this.isintegralAdd = true
      },
      //编辑积分营销
      editintegral(){
        this.integralDialog = true
        this.isintegralAdd = false
      },
      _handleSuccess() {
        this.getDetail()
      },
      //开通观影活动
      filmOpen() {
        this.$confirm('开通观影活动后，店铺可在神椰商户端进行观影活动发布，并分享观影活动', '开通观影活动', {
          confirmButtonText: '确认开通',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          moduleFilmOpen(this.id).then((res) => {
            this.getDetail()
            this.$message({
              type: 'success',
              message: '开通成功!'
            });
          });

        }).catch(() => {});
      },
    },
  };

</script>
<style lang="scss" scoped>
  @import "../../style/merchantsDetail";

  .merchantsFunction {
    background: #fff;
    padding: 20px;
    border-radius: 12px;
  }

  .main {
    display: flex;
    justify-content: center;

    .listBox {
      display: flex;
      flex-direction: column;
      align-items: center;
      margin: 0 20px;

      .listBottom {
        display: flex;
        flex-direction: column;
        align-items: center;

        .issuer {
          margin-bottom: 5px;
        }
      }
    }

    .status {
      font-size: 16px;
      font-weight: 600;
      height: 20px;
      line-height: 20px;
      color: #606266;
    }

    .list {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      width: 185px;
      height: 166px;
      border: 1px solid #EBEBEB;
      border-radius: 12px;
      margin: 14px 0 24px 0;

      img {
        width: 73px;
        height: 73px;
      }

      span {
        margin-top: 14px;
        font-size: 16px;
        font-weight: 600;
      }
    }
  }

  .suanBox_1 {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .suanBox {
    display: flex;
    justify-content: center;
  }

</style>
